<template>
  <div class="container">
  <el-card style="width:380px">
    <template #header>
      <div class="card-header">
        <span>神土信息物联网中台</span>
      </div>
    </template>
    <el-form :model="from" label-width="auto" style="padding: 10px;">
      <el-form-item label="编码">
        <el-input v-model="from.username" placeholder="请输入用户名"/>
      </el-form-item>
      <el-form-item label="名称">
        <el-input v-model="from.password" type="password" placeholder="请输入密码"/>
      </el-form-item>
      <div style="text-align:center;margin: 10px auto;">
        <el-button type="primary" @click="handleLogin">登录</el-button>
      </div>
    </el-form>
  </el-card>
  </div>
</template>
<script>
const {ElMessage,ElMessageBox} = ElementPlus;
import {login} from '../http/auth.js'
export default {
  setup() {



    const from = ref({
      username:'admin',
      password:''
    })
    const handleLogin = ()=>{
      console.log(login)
      login(from.value).then(res=>{
        if(res.data.code===200){
          router.push("/home")
        }else{
          ElMessage.error(res.data.msg)
        }
        console.log(res)
      })
    }
    return {from,handleLogin}
  }
}
</script>
<style scoped>

.container {
  display: flex;
  justify-content: center; /* 水平居中 */
  align-items: center;     /* 垂直居中 */
  height: 100vh;           /* 容器高度，例如100%视口高度 */
}
.card-header{
  font-size: 18px;
  font-weight: bold;
}
</style>